<template>
	<view class="cart-page">
		<titleBar title="购物车" :isSubPage="true"></titleBar>

		<!-- 空购物车提示 -->
		<view class="empty-cart" v-if="cartItems.length === 0">
			<image src="/static/empty-cart.png" mode="aspectFit" class="empty-cart-image"></image>
			<text class="empty-cart-text">购物车还是空的哦</text>
			<button class="btn-go-shop" @click="navigateToHome">去逛逛</button>
		</view>

		<!-- 购物车列表 -->
		<view class="cart-content" v-else>
			<!-- 商家店铺 -->
			<view class="cart-shop-section" v-for="(shop, shopIndex) in shopCartItems" :key="shopIndex">
				<!-- 店铺标题 -->
				<view class="shop-header">
					<view class="checkbox-wrapper" @click="toggleShopSelect(shop.shopId)">
						<view class="checkbox" :class="{ 'selected': shop.selected }">
							<text v-if="shop.selected" class="checkbox-icon">✓</text>
						</view>
					</view>
					<image :src="shop.avatar" mode="aspectFill" class="shop-logo"></image>
					<text class="shop-name">{{ shop.shopName }}</text>
					<view class="shop-badge" v-if="shop.isSelfOperated">自营</view>
				</view>

				<!-- 商品列表 -->
				<view class="cart-items">
					<view class="cart-item" v-for="(item, itemIndex) in shop.items" :key="item.id">
						<!-- 商品选择 -->
						<view class="checkbox-wrapper" @click="toggleItemSelect(shop.shopId, item.id)">
							<view class="checkbox" :class="{ 'selected': item.selected }">
								<text v-if="item.selected" class="checkbox-icon">✓</text>
							</view>
						</view>

						<!-- 商品图片 -->
						<image :src="item.picture" mode="aspectFill" class="item-image"
							@click="navigateToDetail(item.id)"></image>

						<!-- 商品信息 -->
						<view class="item-info">
							<text class="item-name" @click="navigateToDetail(item.id)">{{ item.tradeName }}</text>
							<view class="item-specs">{{ item.introduction ?  item.introduction : '暂无商品描述' }}</view>

							<!-- 促销标签 -->
							<view class="item-promo" v-if="item.promotion">
								<text class="promo-tag">{{ item.promotion.type }}</text>
								<text class="promo-text">{{ item.promotion.text }}</text>
							</view>

							<!-- 价格和数量控制 -->
							<view class="item-bottom">
								<view class="item-price">
									<text class="price-symbol">¥</text>
									<text class="price-value">{{ item.prices ? item.prices.toFixed(2): '0.00' }}</text>
								</view>

								<view class="quantity-control">
									<view class="quantity-btn" @click="decreaseQuantity(shop.shopId, item.id)">−</view>
									<input type="number" class="quantity-input" v-model="item.quantity"
										@blur="updateQuantity(shop.shopId, item.id)" />
									<view class="quantity-btn" @click="increaseQuantity(shop.shopId, item.id)">+</view>
								</view>
							</view>
						</view>

						<!-- 删除按钮 -->
						<view class="item-delete" @click="showDeleteConfirm(shop.shopId, item.id)">
							<text class="delete-icon">×</text>
						</view>
					</view>
				</view>

				<!-- 优惠信息 -->
				<view class="promotion-section" v-if="shop.promotions && shop.promotions.length">
					<view class="promotion-item" v-for="(promotion, promoIndex) in shop.promotions" :key="promoIndex"
						@click="togglePromotion(shop.shopId, promotion.id)">
						<text class="promotion-tag">{{ promotion.type }}</text>
						<text class="promotion-text">{{ promotion.text }}</text>
						<text class="promotion-arrow">{{ promotion.expanded ? '↑' : '↓' }}</text>

						<!-- 优惠详情 -->
						<view class="promotion-details" v-if="promotion.expanded">
							<view class="promotion-detail-item" v-for="(detail, detailIndex) in promotion.details"
								:key="detailIndex">
								<text class="detail-text">{{ detail }}</text>
							</view>
						</view>
					</view>
				</view>
			</view>

			<!-- 商品推荐 -->
			<view class="recommended-section">
				<view class="section-title">
					<text class="title-text">猜你喜欢</text>
				</view>

				<view class="recommended-list">
					<view class="recommended-item" v-for="(item, index) in recommendedProducts" :key="index"
						@click="navigateToDetail(item.id)">
						<image :src="item.picture" mode="aspectFill" class="recommended-image"></image>
						<text class="recommended-name">{{ item.tradeName }}</text>
						<text class="recommended-price">¥{{ item.prices ? item.prices.toFixed(2): '0.00' }}</text>
					</view>
				</view>
			</view>
		</view>

		<!-- 底部结算栏 -->
		<view class="cart-footer" v-if="cartItems.length > 0">
			<view class="footer-left">
				<view class="checkbox-wrapper all-select" @click="toggleAllSelect">
					<view class="checkbox" :class="{ 'selected': allSelected }">
						<text v-if="allSelected" class="checkbox-icon">✓</text>
					</view>
					<text class="all-text">全选</text>
				</view>
			</view>

			<view class="footer-right">
				<view class="total-section">
					<view class="total-row">
						<text class="total-label">合计:</text>
						<view class="total-price">
							<text class="price-symbol">¥</text>
							<text class="price-value">{{ totalPrice ?  totalPrice.toFixed(2): '0.00' }}</text>
						</view>
					</view>
					<text class="total-desc" v-if="savedMoney > 0">已优惠:
						¥{{ savedMoney ? savedMoney.toFixed(2) : '0.00'}}</text>
				</view>

				<button class="btn-checkout" @click="checkout">
					结算({{ selectedCount }})
				</button>
			</view>
		</view>

		<!-- 删除确认对话框 -->
		<view class="modal" v-if="showDeleteModal">
			<view class="modal-content">
				<view class="modal-title">确认删除</view>
				<view class="modal-text">确定要从购物车中删除该商品吗？</view>
				<view class="modal-buttons">
					<button class="modal-btn btn-cancel" @click="cancelDelete">取消</button>
					<button class="modal-btn btn-confirm" @click="confirmDelete">确定</button>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import titleBar from '@/components/titleBar.vue'
	import {
		productApi
	} from '@/api/user.js'

	export default {
		components: {
			titleBar
		},
		data() {
			return {
				cartItems: [], // 所有购物车商品
				shopCartItems: [], // 按店铺分组的购物车商品
				recommendedProducts: [], // 推荐商品
				allSelected: false, // 是否全选
				totalPrice: 0, // 总价
				savedMoney: 0, // 节省金额
				selectedCount: 0, // 已选商品数量
				showDeleteModal: false, // 是否显示删除确认框
				deleteTarget: { // 要删除的目标商品
					shopId: null,
					itemId: null
				}
			}
		},
		mounted() {
			this.fetchCartData();
			this.getGoods();
		},
		methods: {
			// 获取购物车数据
			async fetchCartData() {
				try {
					const cartData = await productApi.getShopCar();

					if (cartData && Array.isArray(cartData)) {
						// 直接将API返回的扁平数组赋值给cartItems，确保price字段有值
						this.cartItems = cartData.map(item => ({
							...item,
							price: item.price || 0, // 确保price有默认值
							quantity: item.quantity || 1 // 确保quantity有默认值
						}));

						// 根据shopId分组构建shopCartItems
						const shopMap = {};

						// 收集所有不重复的shopId
						const shopIds = [...new Set(cartData.map(item => item.shopId || 0))];

						// 批量获取店铺信息
						const storePromises = shopIds.map(shopId => productApi.getStoreById({
							id: shopId
						}));
						const storeResults = await Promise.all(storePromises);

						// 创建shopId到店铺信息的映射
						const storeInfoMap = {};
						storeResults.forEach((storeData, index) => {
							if (storeData) {
								storeInfoMap[shopIds[index]] = storeData;
							}
						});

						// 遍历每个购物车项目，按店铺ID分组
						cartData.forEach(item => {
							const shopId = item.shopId || 0; // 确保shopId有默认值
							const storeInfo = storeInfoMap[shopId] || {};

							// 如果这个店铺ID还没有在shopMap中，创建它
							if (!shopMap[shopId]) {
								shopMap[shopId] = {
									shopId: shopId,
									shopName: storeInfo.shopName || item.shopName || `店铺${shopId}`,
									avatar: storeInfo.avatar || item.shopLogo ||
										'/static/default-shop.png',
									isSelfOperated: storeInfo.isSelfOperated || item.isSelfOperated ||
										false,
									selected: false,
									items: []
								};
							}

							// 将当前项目添加到对应店铺的items数组中，确保price有默认值
							shopMap[shopId].items.push({
								...item,
								price: item.price || 0, // 确保price有默认值
								quantity: item.quantity || 1, // 确保quantity有默认值
								selected: false
							});
						});

						// 将shopMap转换为数组
						this.shopCartItems = Object.values(shopMap);

						// 确保推荐商品价格也有值
						this.recommendedProducts = this.recommendedProducts.map(product => ({
							...product,
							price: product.price || 0
						}));

						this.calculateTotal();
						this.checkAllSelected();
					} else {
						console.log('购物车数据格式错误或为空', cartData);
						this.cartItems = [];
						this.shopCartItems = [];
					}
				} catch (error) {
					uni.showToast({
						title: '获取购物车信息失败: ' + (error.message || '未知错误'),
						icon: 'none'
					});
					console.error('获取购物车信息失败：', error);
				}
			},
			async getGoods() {
				try {
					const result = await productApi.getProductList()
					this.recommendedProducts = result.slice(8, 10)
				} catch (error) {
					uni.showToast({
						title: '获取商品失败: ' + (error.message || '未知错误'),
						icon: 'none'
					});
					console.error('获取商品失败', error);
				}
			},
			// 切换店铺商品全选
			toggleShopSelect(shopId) {
				const shop = this.shopCartItems.find(shop => shop.shopId === shopId);
				if (shop) {
					const newSelected = !shop.selected;
					shop.selected = newSelected;

					// 更新该店铺下所有商品的选中状态
					shop.items.forEach(item => {
						item.selected = newSelected;
					});

					this.calculateTotal();
					this.checkAllSelected();
				}
			},

			// 切换单个商品选中状态
			toggleItemSelect(shopId, itemId) {
				const shop = this.shopCartItems.find(shop => shop.shopId === shopId);
				if (shop) {
					const item = shop.items.find(item => item.id === itemId);
					if (item) {
						item.selected = !item.selected;

						// 检查该店铺下所有商品是否都被选中
						const allItemsSelected = shop.items.every(item => item.selected);
						shop.selected = allItemsSelected;

						this.calculateTotal();
						this.checkAllSelected();
					}
				}
			},

			// 切换全选状态
			toggleAllSelect() {
				this.allSelected = !this.allSelected;

				// 更新所有店铺和商品的选中状态
				this.shopCartItems.forEach(shop => {
					shop.selected = this.allSelected;
					shop.items.forEach(item => {
						item.selected = this.allSelected;
					});
				});

				this.calculateTotal();
			},

			// 检查是否全部选中
			checkAllSelected() {
				// 检查所有商品是否都被选中
				if (this.cartItems.length === 0) {
					this.allSelected = false;
					return;
				}

				this.allSelected = this.cartItems.every(item => item.selected);
			},

			// 增加商品数量
			increaseQuantity(shopId, itemId) {
				const shop = this.shopCartItems.find(shop => shop.shopId === shopId);
				if (shop) {
					const item = shop.items.find(item => item.id === itemId);
					if (item && item.quantity < item.stock) {
						item.quantity++;
						this.calculateTotal();
					} else {
						uni.showToast({
							title: '已达到最大库存',
							icon: 'none'
						});
					}
				}
			},

			// 减少商品数量
			decreaseQuantity(shopId, itemId) {
				const shop = this.shopCartItems.find(shop => shop.shopId === shopId);
				if (shop) {
					const item = shop.items.find(item => item.id === itemId);
					if (item && item.quantity > 1) {
						item.quantity--;
						this.calculateTotal();
					} else {
						this.showDeleteConfirm(shopId, itemId);
					}
				}
			},

			// 更新商品数量
			updateQuantity(shopId, itemId) {
				const shop = this.shopCartItems.find(shop => shop.shopId === shopId);
				if (shop) {
					const item = shop.items.find(item => item.id === itemId);
					if (item) {
						// 确保数量为有效数字
						let quantity = parseInt(item.quantity);
						if (isNaN(quantity) || quantity < 1) {
							quantity = 1;
						} else if (quantity > item.stock) {
							quantity = item.stock;
							uni.showToast({
								title: '已调整到最大库存',
								icon: 'none'
							});
						}

						item.quantity = quantity;
						this.calculateTotal();
					}
				}
			},

			// 显示删除确认对话框
			showDeleteConfirm(shopId, itemId) {
				this.deleteTarget.shopId = shopId;
				this.deleteTarget.itemId = itemId;
				this.showDeleteModal = true;
			},

			// 取消删除
			cancelDelete() {
				this.showDeleteModal = false;
				this.deleteTarget = {
					shopId: null,
					itemId: null
				};
			},

			// 确认删除
			confirmDelete() {
				const {
					shopId,
					itemId
				} = this.deleteTarget;

				// 从购物车中删除商品
				const shopIndex = this.shopCartItems.findIndex(shop => shop.shopId === shopId);
				if (shopIndex !== -1) {
					const shop = this.shopCartItems[shopIndex];
					const itemIndex = shop.items.findIndex(item => item.id === itemId);

					if (itemIndex !== -1) {
						// 从店铺商品列表中移除
						shop.items.splice(itemIndex, 1);

						// 如果店铺没有商品了，从店铺列表中移除该店铺
						if (shop.items.length === 0) {
							this.shopCartItems.splice(shopIndex, 1);
						}

						// 从平铺商品列表中移除
						const flatItemIndex = this.cartItems.findIndex(item => item.id === itemId && item.shopId ===
							shopId);
						if (flatItemIndex !== -1) {
							this.cartItems.splice(flatItemIndex, 1);
						}

						// 重新计算总价和检查全选状态
						this.calculateTotal();
						this.checkAllSelected();

						uni.showToast({
							title: '商品已删除',
							icon: 'success'
						});
					}
				}

				this.showDeleteModal = false;
				this.deleteTarget = {
					shopId: null,
					itemId: null
				};
			},

			// 切换优惠展开状态
			togglePromotion(shopId, promotionId) {
				const shop = this.shopCartItems.find(shop => shop.shopId === shopId);
				if (shop) {
					const promotion = shop.promotions.find(promo => promo.id === promotionId);
					if (promotion) {
						promotion.expanded = !promotion.expanded;
					}
				}
			},

			// 计算总价和已选商品数量
			calculateTotal() {
				let total = 0;
				let count = 0;
				let saved = 0;

				// 计算选中商品的总价和数量
				this.shopCartItems.forEach(shop => {
					if (shop && shop.items) {
						shop.items.forEach(item => {
							if (item && item.selected) {
								// 确保price和quantity有值
								const price = item.prices || 0;
								const quantity = item.quantity || 0;
								total += price * quantity;
								count += quantity;

								// 计算节省金额
								if (item.originalPrice) {
									saved += (item.originalPrice - price) * quantity;
								}
							}
						});
					}
				});

				this.totalPrice = total;
				this.selectedCount = count;
				this.savedMoney = saved;
			},

			// 结算
			checkout() {
				if (this.selectedCount === 0) {
					uni.showToast({
						title: '请选择要结算的商品',
						icon: 'none'
					});
					return;
				}

				// 提取选中的商品
				const selectedItems = [];
				this.shopCartItems.forEach(shop => {
					shop.items.forEach(item => {
						if (item.selected) {
							selectedItems.push({
								id: item.id,
								quantity: item.quantity,
								price: item.price,
								shopId: shop.shopId
							});
						}
					});
				});

				// 将选中的商品数据存储到本地以便传递到结算页面
				uni.setStorageSync('checkoutItems', JSON.stringify(selectedItems));

				// 跳转到结算页面
				uni.navigateTo({
					url: '/pages/order/confirm'
				});
			},

			// 导航到商品详情页
			navigateToDetail(productId) {
				uni.navigateTo({
					url: `/pages/product/detail?id=${productId}`
				});
			},

			// 导航到首页
			navigateToHome() {
				uni.switchTab({
					url: '/pages/index/index'
				});
			}
		}
	}
</script>

<style scoped>
	.cart-page {
		background-color: #f5f5f5;
		min-height: 100vh;
		padding-bottom: 100rpx;
	}

	/* 空购物车样式 */
	.empty-cart {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		padding: 100rpx 0;
	}

	.empty-cart-image {
		width: 200rpx;
		height: 200rpx;
		margin-bottom: 30rpx;
	}

	.empty-cart-text {
		font-size: 30rpx;
		color: #999;
		margin-bottom: 40rpx;
	}

	.btn-go-shop {
		background-color: #FF6B35;
		color: #fff;
		font-size: 28rpx;
		padding: 10rpx 60rpx;
		border-radius: 40rpx;
	}

	/* 购物车内容样式 */
	.cart-content {
		padding-bottom: 100rpx;
	}

	/* 店铺样式 */
	.cart-shop-section {
		background-color: #fff;
		margin-bottom: 20rpx;
	}

	.shop-header {
		display: flex;
		align-items: center;
		padding: 20rpx;
		border-bottom: 1rpx solid #f0f0f0;
	}

	.shop-logo {
		width: 50rpx;
		height: 50rpx;
		border-radius: 50%;
		margin-right: 10rpx;
	}

	.shop-name {
		flex: 1;
		font-size: 28rpx;
		font-weight: bold;
	}

	.shop-badge {
		font-size: 20rpx;
		background-color: #FF6B35;
		color: #fff;
		padding: 2rpx 10rpx;
		border-radius: 10rpx;
	}

	/* 复选框样式 */
	.checkbox-wrapper {
		display: flex;
		align-items: center;
		margin-right: 15rpx;
	}

	.checkbox {
		width: 40rpx;
		height: 40rpx;
		border-radius: 50%;
		border: 1rpx solid #ddd;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.checkbox.selected {
		background-color: #FF6B35;
		border-color: #FF6B35;
	}

	.checkbox-icon {
		color: #fff;
		font-size: 24rpx;
	}

	/* 商品列表样式 */
	.cart-items {}

	.cart-item {
		display: flex;
		padding: 20rpx;
		border-bottom: 1rpx solid #f0f0f0;
		position: relative;
	}

	.item-image {
		width: 160rpx;
		height: 160rpx;
		border-radius: 8rpx;
		margin-right: 20rpx;
	}

	.item-info {
		flex: 1;
		display: flex;
		flex-direction: column;
		position: relative;
	}

	.item-name {
		font-size: 28rpx;
		color: #333;
		margin-bottom: 10rpx;
		line-height: 1.4;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
		overflow: hidden;
	}

	.item-specs {
		font-size: 24rpx;
		color: #999;
		margin-bottom: 10rpx;
	}

	.item-promo {
		display: flex;
		align-items: center;
		margin-bottom: 10rpx;
	}

	.promo-tag {
		font-size: 20rpx;
		color: #FF6B35;
		background-color: rgba(255, 107, 53, 0.1);
		padding: 2rpx 10rpx;
		border-radius: 4rpx;
		margin-right: 10rpx;
	}

	.promo-text {
		font-size: 24rpx;
		color: #FF6B35;
	}

	.item-bottom {
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-top: auto;
	}

	.item-price {
		display: flex;
		align-items: baseline;
	}

	.price-symbol {
		font-size: 24rpx;
		color: #FF6B35;
	}

	.price-value {
		font-size: 32rpx;
		color: #FF6B35;
		font-weight: bold;
	}

	.quantity-control {
		display: flex;
		align-items: center;
		border: 1rpx solid #eee;
		border-radius: 4rpx;
	}

	.quantity-btn {
		width: 60rpx;
		height: 60rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		font-size: 28rpx;
		background-color: #f5f5f5;
	}

	.quantity-input {
		width: 80rpx;
		height: 60rpx;
		text-align: center;
		font-size: 28rpx;
		border-left: 1rpx solid #eee;
		border-right: 1rpx solid #eee;
	}

	.item-delete {
		position: absolute;
		top: 20rpx;
		right: 20rpx;
		width: 40rpx;
		height: 40rpx;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.delete-icon {
		font-size: 32rpx;
		color: #999;
	}

	/* 优惠信息样式 */
	.promotion-section {
		padding: 0 20rpx;
		background-color: #f9f9f9;
	}

	.promotion-item {
		padding: 20rpx 0;
		border-bottom: 1rpx solid #f0f0f0;
	}

	.promotion-text {
		font-size: 24rpx;
		color: #666;
		margin: 0 10rpx;
		flex: 1;
	}

	.promotion-arrow {
		font-size: 24rpx;
		color: #999;
	}

	.promotion-details {
		margin-top: 10rpx;
	}

	.promotion-detail-item {
		font-size: 24rpx;
		color: #999;
		padding: 8rpx 0;
		padding-left: 20rpx;
	}

	.detail-text {
		position: relative;
		padding-left: 20rpx;
	}

	.detail-text::before {
		content: '•';
		position: absolute;
		left: 0;
		top: 0;
	}

	/* 商品推荐样式 */
	.recommended-section {
		background-color: #fff;
		padding: 20rpx;
		margin-top: 20rpx;
	}

	.section-title {
		margin-bottom: 20rpx;
	}

	.title-text {
		font-size: 30rpx;
		font-weight: bold;
	}

	.recommended-list {
		display: flex;
		flex-wrap: wrap;
		margin: 0 -10rpx;
	}

	.recommended-item {
		width: calc(50% - 20rpx);
		margin: 0 10rpx 20rpx;
	}

	.recommended-image {
		width: 100%;
		height: 300rpx;
		border-radius: 8rpx;
	}

	.recommended-name {
		font-size: 26rpx;
		color: #333;
		margin: 10rpx 0;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
		overflow: hidden;
		height: 74rpx;
	}

	.recommended-price {
		font-size: 26rpx;
		color: #FF6B35;
		font-weight: bold;
	}

	/* 底部结算栏 */
	.cart-footer {
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
		height: 100rpx;
		background-color: #fff;
		display: flex;
		align-items: center;
		padding: 0 20rpx;
		box-shadow: 0 -2rpx 10rpx rgba(0, 0, 0, 0.05);
		z-index: 100;
	}

	.footer-left {
		display: flex;
		align-items: center;
	}

	.all-select {
		display: flex;
		align-items: center;
	}

	.all-text {
		font-size: 28rpx;
		color: #333;
	}

	.footer-right {
		flex: 1;
		display: flex;
		justify-content: flex-end;
		align-items: center;
	}

	.total-section {
		margin-right: 20rpx;
	}

	.total-row {
		display: flex;
		align-items: baseline;
	}

	.total-label {
		font-size: 28rpx;
		color: #333;
		margin-right: 10rpx;
	}

	.total-price {
		display: flex;
		align-items: baseline;
	}

	.total-desc {
		font-size: 24rpx;
		color: #FF6B35;
	}

	.btn-checkout {
		background-color: #FF6B35;
		color: #fff;
		font-size: 28rpx;
		padding: 0 30rpx;
		height: 70rpx;
		line-height: 70rpx;
		border-radius: 35rpx;
	}

	/* 删除确认对话框样式 */
	.modal {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background-color: rgba(0, 0, 0, 0.5);
		display: flex;
		justify-content: center;
		align-items: center;
		z-index: 999;
	}

	.modal-content {
		width: 560rpx;
		background-color: #fff;
		border-radius: 12rpx;
		padding: 30rpx;
	}

	.modal-title {
		font-size: 32rpx;
		font-weight: bold;
		text-align: center;
		margin-bottom: 20rpx;
	}

	.modal-text {
		font-size: 28rpx;
		color: #666;
		text-align: center;
		margin-bottom: 30rpx;
	}

	.modal-buttons {
		display: flex;
		justify-content: space-between;
	}

	.modal-btn {
		flex: 1;
		height: 80rpx;
		line-height: 80rpx;
		text-align: center;
		border-radius: 40rpx;
		font-size: 28rpx;
	}

	.btn-cancel {
		background-color: #f5f5f5;
		color: #666;
		margin-right: 20rpx;
	}

	.btn-confirm {
		background-color: #FF6B35;
		color: #fff;
	}
</style>